<template>
  <div class="fllow-details">
    <m-header title="方案详情"></m-header>
    <fllow-item :isDetail="true"></fllow-item>
    <div class="plan-info vtop">
      <cate-cell
        :img="cateImg"
        imgWidth="0.06rem"
        title="方案信息"
      ></cate-cell>
      <follow-cell title="彩种" content="竞彩足球"></follow-cell>
      <follow-cell title="过关方式" content="混合过关  2串1"></follow-cell>
      <follow-cell title="自购金额" content="1000.00元"></follow-cell>
      <follow-cell title="起跟金额" content="50.00元"></follow-cell>
      <follow-cell title="跟单信息" content="共67660.00元" id="1" btnText="跟单列表" @handleCell="handleCell"></follow-cell>
      <follow-cell title="佣金" content="10%"></follow-cell>
      <follow-cell title="状态" content="招募中"></follow-cell>
      <follow-cell title="下单时间" content="2018/11/23  9:23:07"></follow-cell>
      <follow-cell title="百发百中" content="快来和我一起赚钱吧！" :showBorder="false"></follow-cell>
    </div>
    <div class="fllow-detail vtop">
      <cate-cell
        :img="cateImg"
        imgWidth="0.06rem"
        title="方案信息"
      ></cate-cell>
      <div class="no-detail">开赛后可查看投注信息</div>
    </div>
    <div class="fllow-btn">竞彩足球投注</div>
  </div>
</template>
<script>
import FllowItem from '@/components/FllowItem';
import CateCell from '@/components/CateCell';
import FollowCell from '@/components/FollowCell';

export default {
  components: {
    FllowItem,
    CateCell,
    FollowCell
  },
  data () {
    return {
      followBet: 1,
      cateImg: require('../../../assets/imgs/cell/cate4@2x.png')
    }
  },
  methods: {
    handleCell (id) {
      console.log(id);
      this.$router.push({path: `/follow/detail/list/${id}`});
    },
    handleFollowBet () {
      console.log(this.followBet);
    }
  }
}
</script>
<style lang="less" scoped>
  @import '../../../assets/styles/mixins.less';
  .fllow-details {
    padding-top: 0.92rem;
    padding-bottom: 1rem;
    background: #f7f7f7;
    // overflow: auto;
    .plan-info {}
    .fllow-detail {
      background: #ffffff;
      .no-detail {
        height: 0.8rem;
        line-height: 0.8rem;
        font-size: 0.22rem;
        color: #999999;
        text-align: center;
        letter-spacing: 0.06rem;
        .border-1px-bottom(#d2d2d2);
      }
    }
    .fllow-btn {
      position: fixed;
      bottom: 0;
      width: 100%;
      height: 1rem;
      line-height: 1rem;
      font-size: 0.34rem;
      color: #ffffff;
      text-align: center;
      background: #D44743;
    }
  }
</style>
